<template>
    <div>
        <v-dialog
            title="选择合同"
            :show.sync="dialogVisible"
            class="dialogForm"
            width="1200px"
            @beforeClose="beforeClose"
            :close-on-click-modal="false">
            <div class="card-box">
                <div class="card-title">子合同信息</div>
                <el-form ref="projectForm" :model="projectForm" class="form-wrap" size="small" label-position="top">
                    <el-form-item label="合同编号" prop="contractNum">
                        <span class="int-text">{{projectForm.contractNum}}</span>
                    </el-form-item>
                    <el-form-item label="合同类型" prop="contractType">
                        <span class="int-text">{{getCardTypeValue(projectForm.contractType,contractTypes)}}</span>
                    </el-form-item>
                    <el-form-item label="合同金额(元)" prop="contractAmount">
                        <span class="int-text">{{projectForm.contractAmount}}</span>
                    </el-form-item>
                    <el-form-item label="单价(元/m²)" prop="unitPrice">
                        <span class="int-text">{{projectForm.unitPrice}}</span>
                    </el-form-item>
                    <el-form-item label="签订日期" prop="contractDate">
                        <span class="int-text">{{projectForm.contractDate}}</span>
                    </el-form-item>
                    <el-form-item label="合同开始日期" prop="startDate">
                        <span class="int-text">{{projectForm.startDate}}</span>
                    </el-form-item>
                    <el-form-item label="合同结束日期" prop="endDate">
                        <span class="int-text">{{projectForm.endDate}}</span>
                    </el-form-item>
                    <el-form-item label="乙方单位名称" prop="partybUnit">
                        <span class="int-text">{{projectForm.partybUnit}}</span>
                    </el-form-item>
                    <el-form-item label="联系人" prop="partybContact">
                        <span class="int-text">{{projectForm.partybContact}}</span>
                    </el-form-item>
                    <el-form-item label="联系电话" prop="partybPhone">
                        <span class="int-text">{{projectForm.partybPhone}}</span>
                    </el-form-item>
                    <el-form-item label="是否有补充协议" prop="supplement">
                        <span class="int-text">{{getCardTypeValue(projectForm.supplement,supplements)}}</span>
                    </el-form-item>
                    <el-form-item label="补充协议签订日期" prop="signDate" v-if="projectForm.supplement === '1'">
                        <span class="int-text">{{projectForm.signDate}}</span>
                    </el-form-item>
                    <el-form-item label="补充协议期限" prop="suppleStart" v-if="projectForm.supplement === '1'">
                        <span class="int-text">{{projectForm.suppleStart}}至{{projectForm.suppleEnd}}</span>
                    </el-form-item>
                    <el-form-item label="补充协议金额(元)" prop="suppleAmount" v-if="projectForm.supplement === '1'">
                        <span class="int-text">{{projectForm.suppleAmount}}</span>
                    </el-form-item>
                </el-form>
                <div class="card-box">
                    <div class="card-title">其他费用</div>
                    <div class="handling-opinions">
                        <el-table :data="projectForm.otherExpenses" align="center">
                            <el-table-column prop="expensesName" label="费用项目名称" width="120">
                            </el-table-column>
                            <el-table-column prop="amount" label="金额（元）" width="120">
                            </el-table-column>
                            <el-table-column prop="remarks" label="备注" width="120">
                            </el-table-column>
                        </el-table>
                    </div>
                </div>
                <el-form ref="remarksForm" :model="projectForm" class="form-wrap" size="small" label-position="top">
                    <el-form-item label="备注" class="full" prop="remarks">
                        <span class="int-text">{{projectForm.remarks}}</span>
                    </el-form-item>
                </el-form>
            </div>
            <div class="card-box" v-if="projectForm.supplement === '1'">
                <div class="card-title">补充协议</div>
                <div class="handling-opinions">
                    <v-upload
                        ref="otherUpload"
                        :busId="projectForm.projectSubContractId"
                        modelType="otherSupplements"
                        @loadCompleted="otherLoadCompleted"
                        isShowFileList
                        :isView="true"
                        multiple
                        v-model="otherFileList"/>
                </div>
            </div>
            <div class="card-box">
                <div class="card-title">附件</div>
                <div class="handling-opinions">
                    <v-upload
                        ref="fileUpload"
                        :busId="projectForm.projectSubContractId"
                        modelType="supplements"
                        @loadCompleted="loadCompleted"
                        isShowFileList
                        :isView="true"
                        multiple
                        v-model="fileList"/>
                </div>
            </div>
            <span slot="foot">
                 <el-button size="small" class="dialog-button-right" @click="handleDialogClear">关闭</el-button>
            </span>
        </v-dialog>
    </div>
</template>

<script>
    export default {
        name: "sub-show",
        created() {
            this.contractTypes = this.getDict('epc_contract_type')
        },
        data() {
            return {
                dialogVisible: false,
                projectForm: {
                    projectId: '',
                    projectTenderId: '',
                    projectSubContractId: '',
                    projectName: '',
                    projectAddress: '',
                    projectType: '',
                    projectContractId: '',
                    contractNum: '',
                    contractType: '',
                    contractAmount: '',
                    unitPrice: '',
                    contractDate: '',
                    startDate: '',
                    endDate: '',
                    partybUnit: '',
                    partybContact: '',
                    partybPhone: '',
                    supplement: '',
                    signDate: '',
                    suppleStart: '',
                    suppleEnd: '',
                    suppleAmount: '',
                    remarks: '',
                    otherExpenses: []
                },
                contractTypes: [],
                otherFileList: [],
                fileList: [],
                supplements: [
                    {
                        value: '1',
                        label: '是'
                    },
                    {
                        value: '0',
                        label: '否'
                    }
                ]
            }
        },
        methods: {
            //对应value取label
            getCardTypeValue(num, sum){
                let arr = sum.filter(e=>e.value === num)
                if (arr.length > 0) {
                    return arr[0].label
                } else {
                    return num
                }
            },
            //打开弹框
            showDialog(item) {
                this.dialogVisible = true
                if (item) {
                    this.projectForm = item.row
                }
            },
            //关闭弹框
            beforeClose(done) {
                this.$emit('beforeClose')
            },
            //关闭
            handleDialogClear() {
                this.$emit('handleClose')
                this.dialogVisible = false
            },
            //补充协议附件回显过滤
            otherLoadCompleted(data) {
                this.$refs.otherUpload.loadFileList = data.filter(item => item.module === 'otherSupplements')
            },
            //附件回显过滤
            loadCompleted(data) {
                this.$refs.fileUpload.loadFileList = data.filter(item => item.module === 'supplements')
            }
        }
    }
</script>

<style scoped lang="scss">
    @include formWrap(4);
    .handling-opinions {
        padding: 20px;
    }
    .int-text {
        color: #999;
    }
</style>
